<template>
<div v-if="data.name" class="detail_page">
  <img class="back" src="~@/assets/back.png"  alt="" @click="back">
  <img class="top_img" :src="data.imgs" alt="">
  <div class="item_ddd">
    <div class="item_t">一、项目名称</div>
    <div class="item_d">{{data.name}}</div>
  </div>
  <div class="item_ddd">
    <div class="item_t">二、项目单位</div>
    <div class="item_d">{{data.unit}}</div>
  </div>
  <div class="item_ddd">
    <div class="item_t">三、项目基本情况</div>
    <div class="item_d">{{data.desc}}</div>
  </div>
  <div class="item_ddd">
    <div class="item_t">四、招商单位联系方式</div>
    <div class="item_d" style="margin-bottom:5px">姓 名：{{data.contact}}</div>
    <div class="item_d" style="margin-bottom:5px">单 位：{{data.unit}}</div>
    <div class="item_d" style="margin-bottom:5px">联系电话：{{data.mobile}}</div>
  </div>
  <div class="item_ddd">
    <div class="item_t">五、项目详情</div>
    <div v-html="data.content"></div>
  </div>
  <back />
</div>
</template>
<script>
import {localprojects,jssdk} from '@/api/api'
import back from '@/components/back.vue'
import { encode } from '@/utils/utils.js'
export default {
  data(){
    return{
      data:{name:''}
    }
  },
  components:{back},
  created(){
    let id = this.$route.query.id
    localprojects.getLocalprojectsDetail({id}).then(res=>{
      this.data = res.data
      jssdk({url: encode(window.location.href)}).then(res=>{
        this.wxInit(res.data)
      })
    })
  },
  methods:{
    back(){
				this.$router.go(-1)
			},
    wxInit(data){
      let that = this
      wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: data.appId, // 必填，公众号的唯一标识
        timestamp: data.timestamp, // 必填，生成签名的时间戳
        nonceStr: data.nonceStr, // 必填，生成签名的随机串
        signature: data.signature,// 必填，签名
        jsApiList: ['onMenuShareAppMessage','onMenuShareTimeline','updateAppMessageShareData','updateTimelineShareData'] // 必填，需要使用的JS接口列表
      })
      wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
        wx.updateAppMessageShareData({ 
          title: `${that.data.name}`, // 分享标题
          desc: that.data.unit,
          link: window.location.href,
          imgUrl: that.data.imgs,
          success: function () {
            // 设置成功
          }
        })
         //自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容（1.4.0）
        wx.updateTimelineShareData({ 
          title: `${that.data.name}`, // 分享标题
          link: window.location.href,
          imgUrl: that.data.imgs,
          success: function () {
            // 设置成功
          }
        })
      }); 
    },
  }
}
</script>
<style lang="scss" scoped>
.detail_page{
  width: 100%;
  position: relative;
}
.top_img{
  width: 100%;
}
.item_ddd{
  margin: 10px;
  .item_t{
    color: rgb(224, 3, 3);
    margin-bottom: 6px;
  }
  .item_d{
    text-indent:28px;
  }
}
.back{
	position:absolute;
	left: 4px;
	top: 7px;
	height: 32px !important;
	width: 32px !important;
	z-index: 1000;
}
</style>